<template>
    <rx-layout style="padding: 10px;">
        <template #middle>
            <rx-fit v-model="fitSearch">
                <template #head>
                    <div style="display: flex;align-items: center;justify-content: space-between;">
                        <div class="table-operator">
                            <a-button type="primary" @click="edit()">
                                <template #icon>
                                    <plus-outlined/>
                                </template>
                                {{ $ti18('rxList.newBtn', '新建') }}
                            </a-button>
                            <a-button v-if="removeEnable && selectedRowKeys.length > 0" type="danger"
                                      @click="delByIds(selectedRowKeys)">
                                <template #icon>
                                    <DeleteOutlined/>
                                </template>
                                {{ $ti18('rxList.delBtn', '删除') }}
                            </a-button>
                        </div>
                        <span class="search-btn" @click.stop="searchshow" @mousedown.stop><SearchOutlined/>{{
                                $ti18('rxList.leachBtn', '过滤')
                            }}</span>
                    </div>
                </template>
                <template #search>
                    <a-form layout="vertical">
                        <a-form-item :label="i18n('form.imageName','图片名称')">
                            <a-input :placeholder="i18n('form.name','请输入名称','input')"
                                     v-model:value="urlConfig.queryParam.Q_FILE_NAME__S_LK"/>
                        </a-form-item>
                    </a-form>
                    <div class="list-search-toolbar">
                        <a-button type="primary" @click="search">
                            <SearchOutlined/>
                            {{ $ti18('rxList.searchBtn', '查询') }}
                        </a-button>
                        <a-button style="margin-left: 4px" @click="resetSearch">
                            <RedoOutlined/>
                            {{ $ti18('rxList.resetBtn', '重置') }}
                        </a-button>
                    </div>
                </template>
                <template #middle>
                    <rx-grid ref="table"
                             :hasPage="true"
                             :urlConfig="urlConfig"
                             :selectConfig="selectConfig"
                             url="/api-system/system/core/sysSignature/query"
                             field="id"
                             :columns="columns"
                    >
                        <template #isDefault="{row}">
                            <a-tag :color="row.isDefault == 1 ? 'green' : 'red'">
                                <span>{{ row.isDefault == 1 ? i18n('list.yes', '是') : i18n('list.no', '否') }}</span>
                            </a-tag>
                        </template>
                        <template #fileId="{row}">
                            <img style="width: 100px;height: 32px;" preview="true" :src="getPath(row.fileId)">
                        </template>
                        <template #action="{ row }">
                            <RxGridAction :size="2">
                                <div @click="edit(row.id)">{{ $ti18('rxList.editBtn', '编辑') }}</div>
                                <div @click="delByIds([row.id])">{{ $ti18('rxList.delBtn', '删除') }}</div>
                            </RxGridAction>
                        </template>
                    </rx-grid>
                </template>
            </rx-fit>
        </template>
    </rx-layout>
</template>

<script>
import SysSignatureApi from '@/common/api/system/sysSignature'
import SysSignatureEdit from './SysSignatureEdit.vue'
import {BaseList, RxFit, RxGrid, Util, TokenUtil} from '@lowcode/jpaas-base-lib';
import {mapState} from 'pinia'
import userUser from "@/stores/userUser";

export default {
    name: 'SysSignatureList',
    mixins: [BaseList],
    components: {
        RxFit
    },
    computed: {
        ...mapState(userUser, ["user"])
    },
    data() {
        return {
            urlConfig: {
                ajaxType: 'post',
                contentType: 'json',
                queryParam: {},
                dataField: 'result.data',
                totalField: 'result.totalCount'
            },
            selectConfig: {
                type: 'checkbox',
            },
            columns: [
                {title: this.i18n('form.name', '名称'), field: 'fileName', minWidth: 240},
                {title: this.i18n('form.owner', '所属人'), field: 'createByName', minWidth: 120},
                {
                    title: this.i18n('form.isDefault', '默认'),
                    field: 'isDefault',
                    minWidth: 60,
                    slots: {default: 'isDefault'}
                },

                {title: this.i18n('form.signature', '签名'), field: 'fileId', minWidth: 120, slots: {default: 'fileId'}},
                {title: this.i18n('form.createTime', '开始时间'), field: 'createTime', minWidth: 100},
                {title: this.$ti18('rxList.action', '操作'), minWidth: 60, field: 'action', slots: {default: 'action'}}
            ]
        }
    },
    created() {
        var params = this.$route.meta.params;
        if (params) {
            var isAdmin = JSON.parse(params).isAdmin;
            if (!isAdmin) {
                this.urlConfig.queryParam["Q_CREATE_BY__S_EQ"] = this.user.userId;
            } else {

            }
        } else {
            this.urlConfig.queryParam["Q_CREATE_BY__S_EQ"] = this.user.userId;
        }
    },
    methods: {
        i18n(name, text, key) {
            return this.$ti18(name, text, "SysSignature", key);
        },
        delById(ids) {
            return SysSignatureApi.del({ids: ids.join(',')});
        },
        edit(pkId) {
            let self = this;
            Util.open({
                component: SysSignatureEdit,
                curVm: this,
                widthHeight: ['600px', '400px'],
                title: pkId ? self.$ti18('rxList.editBtn', '编辑') : self.$ti18('rxList.add', '新增') + '-' + this.i18n('form.signature', '签名'),
                data: {
                    pkId: pkId
                }
            }, function (action, data) {
                if (action != 'ok') {
                    return;
                }
                self.$refs.table.loadData();
            });
        },
        getPath(fileId) {
            if (fileId) {
                var accessToken = TokenUtil.getToken();
                fileId = Util.encryptWord(fileId);
                var url = '/api/api-system/system/core/sysFile/previewFile?fileId=' + fileId + "&accessToken=" + accessToken;
                return url;
            }
            return "";
        },
        resetSearch(){
            let queryParam = {};
            let appId=this.curApp ?this.curApp.appId : "";
            if(this.hasAppId && appId){
                queryParam.Q_APP_ID__S_EQ=appId;
            }
            let params = this.$route.meta.params;
            if (params) {
                var isAdmin = JSON.parse(params).isAdmin;
                if (!isAdmin) {
                    queryParam["Q_CREATE_BY__S_EQ"] = this.user.userId;
                }
            } else {
                queryParam["Q_CREATE_BY__S_EQ"] = this.user.userId;
            }
            this.queryParam = queryParam;
            if(this.urlConfig){
                this.urlConfig.queryParam = queryParam;
            }
            this.$nextTick(() => {
                this.$refs[this.table].loadData();
            })
        }
    }
}
</script>
<style scoped>
.table-operator {
    padding: 4px;
}

.table-operator button {
    margin: 2px;
}
</style>

